<!DOCTYPE html>
<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <title>标签页</title>
    <meta name="referrer" content="never">
    <meta http-equiv="Content-Type" content="text/html">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="theme-color" content="#3b3e43">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <link id="bloggerIcon" rel="shortcut icon" type="image/x-icon"/>
    <link rel="stylesheet" href="lib/layui-v2.5.7/css/layui.css">
    <link rel="stylesheet" href="skins/css/base.css">
    <link rel="stylesheet" href="skins/css/bgSkins.css">
    <link rel="stylesheet" href="./lib/live2d/css/live2d.css"/>
    <link rel="stylesheet" type="text/css" href="./css/flat-ui.min.css"/>
    <link href='https://fonts.googleapis.com/css?family=Patrick+Hand+SC' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" type="text/css" href="./fonts/font-awesome-4.5.0/css/font-awesome.min.css"/>
    <link rel="stylesheet" type="text/css" href="./css/icons.css"/>
    <link rel="stylesheet" type="text/css" href="./lib/APlayer/APlayer.min.css"/>
    <link rel="stylesheet" type="text/css" href="./lib/blogexicon/blogexicon.css"/>
    <link rel="stylesheet" type="text/css" href="./lib/blogexicon/iconfont.css"/>
    <script src="./lib/jquery-3.4.1/jquery-3.4.1.min.js"></script>
    <script src="./lib/layer-v3.5.1/layer/layer.js" charset="utf-8"></script>
    <script src="./lib/axios/axios.min.js"></script>
    <script src="./lib/vue-module/vue.js"></script>
    <script src="./js/main.js"></script>
    <script src="./lib/layui-v2.5.7/layui.js" charset="utf-8"></script>
    <script src="./js/lay-config.js?v=2.0.0" charset="utf-8"></script>
    <script src="./lib/APlayer/APlayer.min.js"></script>
    <script type="text/javascript" src="https://cdn.polyfill.io/v2/polyfill.min.js?features=es6"></script>
    <style type="text/css">[v-cloak] {
        display: none !important;
    }</style>
</head>
<body style="font-size: 16px">
<div class="bg" rel="noreferrer"></div>
<div class="bg bg--1" rel="noreferrer"></div>
<div class="bg bg--2" rel="noreferrer"></div>
<div class="bg bg--3" rel="noreferrer"></div>
<div class="bg bg--4" rel="noreferrer"></div>
<div class="bg bg--5" rel="noreferrer"></div>
<header class="header">
    <div class="header__wrap">
        <a id="Header1_HeaderTitle" href="index.html" rel="section" class="header__logo">
            <i class="icon__home"></i></a>
        <nav class="mobile__hidden header__nav">

            <a href="aboutMe.html" rel="section">
                <img class="page-icon" src="images/vue.png" alt="关于我">关于我
            </a>

            <a v-bind:href="blogger.githubUrl" target="_blank" rel="section">
                <img class="page-icon" src="images/github-icon.png">我的开源
            </a>

            <a href="tagsWall.html" rel="archive">
                <i class="icon__tags"></i> 标签墙
            </a>

            <a href="links.html" rel="section">
                <i class="icon__link"></i> 友情链接
            </a>

            <a href="./api/rss/openApi" rel="section">
                <i class="icon__rss"></i> RSS
            </a>
        </nav>
    </div>
</header>
<div class="header__m fn__none">
    <i class="icon__list fn__none" onclick="$(this).next().slideToggle()"></i>
    <main class="module__list fn__none"></main>
    <i class="icon__more" onclick="$(this).next().slideToggle()"></i>
    <main class="module__list">
        <ul>
            <li>
                <a href="aboutMe.html" rel="section">
                    <img class="page-icon" src="images/vue.png">关于我
                </a>
            </li>

            <li>
                <a v-bind:href="blogger.githubUrl" target="_blank" rel="section">
                    <img class="page-icon" src="images/github-icon.png">我的开源
                </a>
            </li>

            <li>
                <a href="tagsWall.html" rel="archive">
                    <i class="icon__tags"></i> 标签墙
                </a>
            </li>

            <li>
                <a rel="archive" target="_blank" href="links.html">
                    <i class="icon__link"></i>
                    友情链接
                </a>
            </li>
            <li>
                <a href="./rss" rel="section">
                    <i class="icon__rss"></i> RSS
                </a>
            </li>
        </ul>
    </main>
</div>
<div class="main" id="pjax" v-cloak>
    <div class="content">
        <div class="module">
            <div class="module__content ft__center">
                <i class="icon__home"></i>
                <a href="index.html">{{blogger.userName}}的个人博客&nbsp;></a>&nbsp;
                <i class="icon__tags"></i>
                <a href="tagsWall.html">标签&nbsp;>&nbsp;</a>
                <span v-text="tagItem.tagName" class="vditor-tooltipped vditor-tooltipped__w" aria-label=""></span>
            </div>
        </div>
        <main>
            <div class="article-list">
                <article class="item" v-for="(articleItem,index) in articleList" :key="index">
                    <time class="vditor-tooltipped vditor-tooltipped__n item__date"
                          v-bind:aria-label="articleItem.createTime.getFullYear()+'年'">
                        {{articleItem.createTime.getMonth()+1}}月
                        <span class="item__day" v-text="articleItem.createTime.getDate()"></span>
                    </time>

                    <h2 class="item__title">
                        <a v-bind:href="'article.html?articleId='+articleItem.id"
                           rel="bookmark" target="_blank" v-text="articleItem.title"
                           v-on:mouseenter="showMessage('要看'+articleItem.title+'吗？')"></a>
                    </h2>

                    <div class="item__date--m fn__none">
                        <i class="icon__date"></i>{{articleItem.createTime}}
                    </div>
                    <div class="ft__center">
                        <span class="tag">
                            <i class="icon__list"></i>
                            <a href="javascript:void(0)" rel="tag" v-text="getPostType(articleItem)"></a>
                        </span>
                        <span class="tag">
                            <i class="icon__tags"></i>
                             <span href="javascript:void(0)" v-for="(tagItem,index) in articleItem.tagList">
                                 <a v-bind:href="'tags.html?tagId='+tagItem.id" rel="tag" v-text="tagItem.tagName"></a>
                                 <i v-show="index<articleItem.tagList.length-1">,</i>
                             </span>
                        </span>
                        <span class="tag">
                            <i class="icon__views"></i>
                            <a href="javascript:void(0)" rel="tag" v-text="articleItem.viewCount"></a>
                        </span>
                        <span class="tag">
                            <i class="icon__comments"></i>
                            <a href="javascript:void(0)" rel="tag" v-text="articleItem.sumComment"></a>
                        </span>
                    </div>
                </article>
                <div class="fn__clear">
                    <nav class="pagination fn__right">
                        <!--分页容器-->
                        <div id="pagination" class="pagination__item pagination__item--text"></div>
                    </nav>
                </div>
            </div>
        </main>
    </div>

    <aside class="side">
        <section class="vditor-reset module">
            <main class="module__content">
                <div>Blogex<span style="color: orangered; font-weight: bold;">个人博客系统</span></div>
            </main>
        </section>

        <section class="module">
            <header class="module__header">
                <form class="form" onsubmit="return false">
                    <input id="titleInput" placeholder="搜索" class="form__input" type="text" name="keyword">
                    <button class="side__btn" type="submit" v-on:click="search()">
                        <i class="icon__search"></i>
                    </button>
                </form>
            </header>
        </section>

        <div class="module item">
            <header class="module__header ft__center">博主：{{blogger.userName}}</header>
            <main class="module__content ft__center">
                <img class="side__avatar" v-bind:src="blogger.avatarUrl" alt="blogger">
                {{blogger.signature}}<br>
            </main>
        </div>

        <div class="module item">
            <header class="module__header ft__center">音乐盒子</header>
            <main class="module__content fn__clear">
                <div id="aplayer"></div>
            </main>
        </div>

        <div class="module item">
            <header class="module__header">分类(日更新)</header>
            <main class="module__content fn__clear module__content--three">
                <a class="tag vditor-tooltipped vditor-tooltipped__n"
                   v-for="(classifyItem,index) in classifyList" :key="index"
                   v-on:click="getArticleByClassify(classifyItem)"
                   v-text="classifyItem.classifyName" v-bind:aria-label="classifyItem.refCount+'个'">
                </a>
            </main>
        </div>

        <div class="module item">
            <div class="module__header">
                <div class="fn__flex">
                    <div class="fn__flex-1 ft__center">{{overview.sumArticle}} 文章</div>
                    <div class="fn__flex-1 ft__center">{{overview.sumComment}} 评论</div>
                </div>
                <br>
                <div class="fn__flex">
                    <div class="fn__flex-1 ft__center">{{overview.sumView}}<span class="ft-gray">浏览</span></div>
                    <div class="fn__flex-1 ft__center">{{overview.sumSupport}}<span class="ft-gray">点赞</span></div>
                </div>
            </div>
        </div>

    </aside>
</div>
<div id="landlord">
    <div id="live2d-tips" class="live2d-tips" style="opacity: 0;"></div>
    <canvas id="live2d" width="250" height="250" class="live2d"></canvas>
    <div class="live2d-tool">
        <span class="fui-home"></span>
        <span class="fui-user"></span>
        <span class="fui-chat"></span>
        <span class="fui-photo"></span>
        <span class="fui-cross"></span>
    </div>
</div>
<div class="icon__up" onclick="Util.goTop()"></div>
<br>
<br>

<footer class="footer"><a id="footer_a" href="http://beian.miit.gov.cn/" target="_blank"></a></footer>
<script type="text/javascript" src="skins/js/common.min.js" charset="utf-8"></script>
<script src="./js/tags.js"></script>
<script src="./lib/live2d/js/live2dcubismcore.js"></script>
<script src="./lib/live2d/js/live2d.min.js"></script>
<script src="./lib/live2d/js/pixi.min.js"></script>
<script src="./lib/live2d/js/pixi-live2d-display.js"></script>
<script src="./lib/live2d/js/initLive2d.js"></script>
<script type="text/javascript">
    if (!isMobile()) {
        initModel();
    }else {
        $('#landlord').css('display','none');
    }
</script>
</body>
</html>